#{extends 'include/base.html' /}
#{set title:'关注创意人' /}
<div class="box visual">
</div>
<div class="email_win visual">
    <form action="@{Api.writeMail()}">
        <p class="email_win_title">&nbsp站内信</p>
        <p class="hidden mail_err" style="width: 100%;text-align: center;color:red; font-size: 15px;">错误</p>

        <div class="input_wrap box_input_wrap">
            <label for="">标题:</label>
            <input type="text" class="box_input"  name="mail.title" id="title" />
            <input type="hidden" value="${user.id}"  name="mail.receive_id" id="receive_id" />
        </div>
        <div class="input_wrap">
            <label for="">内容:</label>
            <textarea class="box_text"  name="mail.content" id="content" ></textarea>
        </div>
        <div class="btn_wrap_box">
            <button class="btn btn_wrap_box_send" id="btn">发送</button>
            <button class="btn btn_wrap_box_end" type="reset">取消</button>
        </div>
    </form>
    <img src="../public/images/close.png" alt="" class="email_close"/>
</div>

<div class="simple_wrap">
    <ul class="path_nav">
        <li class="path_index"><a href="@{Application.index(0)}">首页</a></li>
        <li>><a href="@{Members.home()}">个人中心</a></li>
        <li>><a href="@{Members.work()}">关注</a></li>
        <li>>关注创意人</li>
        <li>>查看</li>
    </ul>

    <ul class="work_main_nav">
        <li><a href="@{Concerns.myTrend(0)}">动态</a></li>
        <li><a href="@{Members.work(0)}">我的作品</a></li>
        <li><a href="@{Concerns.myConcern(0)}">关注</a></li>
        <li><a href="@{Collections.collectWork(0)}">收藏</a></li>
    </ul>
    <div class="clear"></div>
<div class="concern_top_wrap">
    <div class="concern_top_left">
        <img src="${user.getPhoto()}" alt=""/>
    </div>
    <div class="concern_top_right">
        <div class="concern_top_right_title">
            <p>${user.nickname}</p>
            <a href="" class="end_concern_btn">关注</a>
            <a href="" class="send_info_btn">发消息</a>
        </div>
        <div class="concern_top_right_middle">
            <ul class="concern_top_first_ul">
                <li><h3>${user.articleNum}</h3><p>作品</p></li>
                <li><h3>${user.fansNum}</h3><p>专辑</p></li>
                <li><h3>${user.concernNum}</h3><p>关注</p></li>
                <li><h3>${user.fansNum}</h3><p>粉丝</p></li>
            </ul>
        </div>
        <div class="clear"></div>
        <div class="concern_top_right_bottom">
            <ul class="concern_top_second_ul">
                <li><p><img src="../public/images/place.png" alt=""/>${user.address}</p></li>
                <li><p><img src="../public/images/zuo.png" alt=""/>${user.motto}</p></li>
                <li><p><img src="../public/images/home.png" alt=""/>${user.website}</p></li>
                <li><p><img src="../public/images/weibo.png" alt=""/>${user.weibo}</p></li>
            </ul>
            <div class="clear"></div>
        </div>
    </div>
</div>
<div class="concern_content_wrap">
    <div class="concern_content_nav">
        <ul>
            <li><a href="">总览</a></li>
            <li><a href="@{Concerns.concernMan(user.id)}"  class="concern_nav_active">动态</a></li>
            <li><a href="@{Concerns.concernWork(user.id)}">作品集</a></li>
            <li><a href="@{Concerns.concernAlbum(user.id)}">专辑</a></li>
        </ul>
    </div>

    <div class="concern_content_main">
        <h2>动态</h2>
    #{list items:webServiceBean.data, as:"item"}
        <div class="concern_content_main_item">
            <div class="doth_one"></div>
            <div class="doth_two"></div>
            <div class="concern_time_wrap">
                <div class="triangle">
                </div>
                <p class="concern_time_info">
                    ${new Date(item.time).format('yyyy年MM月dd日')}
                </p>
            </div>
            <div class="concern_content_main_info">
                <div class="info_triangle">
                </div>
                <div class="info_triangle_outline">
                </div>
                <div class="info_triangle_outline_second"></div>
                <div class="info_wrap">
                    <img src="${user.getPhoto()}" alt="" class="info_wrap_tou"/>
                    <img src="${item.url?item.url:"../public/images/hh.png"}" alt="" class="info_work"/>
                    <p class="info_work_name">${user.nickname}</p>
                    #{if item.type==1}
                        <p class="info_work_type">上传了一个作品</p>
                    #{/if}
                    #{if item.type==0}
                        <p class="info_work_type">发布了一个专辑</p>
                    #{/if}
                </div>
            </div>
        </div>
    #{/list}



    </div>
</div>
</div>
<script type="text/javascript">
     $('.send_info_btn').click(function (event) {
         event.preventDefault();
         $('.box').removeClass('visual');
         $('.email_win').removeClass('visual');
     })
    $('.email_close').click(function () {
        $('.box').addClass('visual');
        $('.email_win').addClass('visual');
    })
     $('#btn').click(function (event) {
         event.preventDefault();
         var title = $('#title').val();
         var content =  $('#content').val();
         var receive_id =  $('#receive_id').val();
         var  data ={
             mail:{
             }
         };
         data.mail.receive_id=receive_id;
         data.mail.title=title;
         data.mail.content=content;
         $.post('@{Api.writeMail()}', data, function(res) {
                 $('.mail_err').text(res.data);
                 $('.mail_err').removeClass('hidden');
         });
     });
    $('.end_concern_btn').click(function (event) {
        event.preventDefault();
        var data = {
            beConcernId:"${user.id}"
        }
        $.post('@{Api.concern()}', data, function(res) {
           if(res.result==0) {
                alert(res.data)
           }
           else {

               $('.end_concern_btn').text("已关注")
           }
        });
    })
</script>